<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>controlP5 : : Tab</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="stylesheet.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
document.getElementsByTagName('html')[0].className = 'isjs';

function toggle(dt) 
{ 
  var display, dd=dt; 
  /* get dd */ 
  do{ dd = dd.nextSibling } while(dd.tagName!='DD'); 
  toOpen =!dd.style.display; 
  dd.style.display = toOpen? 'block':'' 
  dt.getElementsByTagName('span')[0].innerHTML 
    = toOpen? '-':'+' ; 
} 
</script>
</head>
<body>
<div id="container">
		<div id="header">
		<a href="./index.htm"><img src="./docuImages/title.jpg" /></a>
		</div>
	<div class="content">
		<h1>Tab</h1>
		<dl><dt class="key">description</dt><dd class="value">Tab extends ControllerGroup, for more available methods
 see the ControllerGroup documentation.</dd></dl>
			
			<div class="toggleList example">
				<dl><dt onclick="toggle(this)"><span>+</span>Example</dt>
					<dd><pre>import controlP5.*;


ControlP5 controlP5;

int myColorBackground = color(0,0,0);

int sliderValue = 100;

void setup() {
  size(400,400);
  frameRate(30);
  controlP5 = new ControlP5(this);
  controlP5.addButton("button",10,100,80,80,20);
  controlP5.addButton("buttonValue",4,100,110,80,20);
  controlP5.addSlider("sliderValue",0,255,128,100,200,10,100);
  controlP5.addSlider("slider",100,200,128,100,160,100,10);
  controlP5.controller("slider").moveTo("global");
  controlP5.controller("sliderValue").moveTo("extra");
  controlP5.tab("extra").setColorForeground(0xffff0000);
  controlP5.tab("extra").setColorBackground(0xff330000);
  
  controlP5.trigger();
  
  // in case you want to receive a controlEvent when
  // a  tab is clicked, use activeEvent(true)
  controlP5.tab("extra").activateEvent(true);
  controlP5.tab("extra").setId(2);
  
  controlP5.tab("default").activateEvent(true);
  // to rename the label of a tab, use setLabe("..."),
  // the name of the tab will remain as given when initialized.
  controlP5.tab("default").setLabel("something");
  controlP5.tab("default").setId(1);
}

void draw() {
  background(myColorBackground);
  fill(sliderValue);
  rect(0,0,width,100);
}

void slider(int theColor) {
  myColorBackground = color(theColor);
  println("a slider event. setting background to "+theColor);
}

void controlEvent(ControlEvent theControlEvent) {
  if(theControlEvent.isController()) {
    println("controller : "+theControlEvent.controller().id());
  } else if (theControlEvent.isTab()) {
    println("tab : "+theControlEvent.tab().id()+" / "+theControlEvent.tab().name());
  }
}
</pre></dd>
				</dl>
			</div>
			
			
			
			<dl><dt class="key">constructors</dt><dd class="value"><pre></pre></dd></dl>
			
			
			
			
			
			
			
			<!-- METHODS:BEGIN -->
			
       <dl class="noborder"><dt>Methods</dt></dl>
       <dl><dt class="key"><a href="tab_method_activateevent.htm">activateEvent ( )</a></dt><dd class="value">activate or deactivate the Event status of a tab.</dd></dl>
<dl><dt class="key"><a href="tab_method_setlabel.htm">setLabel ( )</a></dt><dd class="value">set the label of the group.
 TODO overwriting COntrollerGroup.setLabel to set the Width of a tab 
 after renaming. this should be temporary and fixed in the future.</dd></dl>
<dl><dt class="key"><a href="tab_method_setstringvalue.htm">setStringValue ( )</a></dt><dd class="value">set the string value of the tab.</dd></dl>
<dl><dt class="key"><a href="tab_method_setvalue.htm">setValue ( )</a></dt><dd class="value">set the value of the tab.</dd></dl>
<dl><dt class="key"><a href="tab_method_stringvalue.htm">stringValue ( )</a></dt><dd class="value">get the string value of the tab.</dd></dl>
<dl><dt class="key"><a href="tab_method_value.htm">value ( )</a></dt><dd class="value">get the value of the tab.</dd></dl>

   
			<!-- METHODS:END -->
			<div class="separator">
			<dl><dt class="key">usage</dt><dd class="value">Web & Application</dd></dl>
			</div>
			<div class="separator">
			<dl><dt class="key">related</dt><dd class="value"><ul><li><a href="controllergroup_class_controllergroup.htm">ControllerGroup</a></li>
</ul></dd></dl>
			</div>
	</div>
	<div id="footer">
	<p>by andreas schlegel (<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/" target="_blank">cc</a>) 2007, <a href="http://www.sojamo.de" target="_blank">sojamo</a>.</p>
	</div>
</div>
</body>
</html>


